<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="basePath" value="${pageContext.request.contextPath}"/>
<!DOCTYPE HTML>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>微信用户管理</title>
    <jsp:include page="/resources/inc/head.jsp" flush="true"/>
</head>
<body>
<div id="main">
    <div id="collapseOne" class="panel-collapse collapse">
        <div class="panel panel-default" id="queryHead">
            <form id="queryForm" method="post" class="form-horizontal" onsubmit="return false;">
                <div class="panel-body form-group" style="margin-bottom:0px;">
                    <label class="col-sm-1 control-label" style="text-align: right; margin-top:5px">用户编号：</label>
                    <div class="col-sm-2">
                        <input type="text" class="form-control" name="userId" id="userId"  onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}"
                               onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'0')}else{this.value=this.value.replace(/\D/g,'')}">
                    </div>
                    <label class="col-sm-1 control-label" style="text-align: right; margin-top:5px">用户昵称：</label>
                    <div class="col-sm-2">
                        <input type="text" class="form-control" name="userName" id="userName"/>
                    </div>
                    <label class="col-sm-1 control-label" style="text-align: right; margin-top:5px">手机号：</label>
                    <div class="col-sm-2">
                        <input type="text" class="form-control" name="userTel" id="userTel"/>
                    </div>
                </div>
                <div class="panel-body form-group" style="margin-bottom:0px;">
                    <label class="col-sm-1 control-label" style="text-align: right; margin-top:5px">注册时间：</label>
                    <div class="col-sm-2">
                        <input type="text" id="beginTime"  class="form-control" data-date-format="yyyy-mm-dd" placeholder="开始时间" value="" pattern="yyyy-MM-dd" />
                        <input type="text" hidden name="beginTime" value="">
                    </div>
                    <div class="col-sm-2">
                        <input type="text" id="endTime" class="form-control" data-date-format="yyyy-mm-dd" placeholder="结束时间" value="" pattern="yyyy-MM-dd" />
                        <input type="text" hidden name="endTime" value="">
                    </div>
                    <div class="">
                        <button type="button" class="btn btn-primary" id="search_btn">查询</button>
                        <button type="reset" class="btn btn-primary" id="reset_btn">重置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
    <div id="toolbar">
        <%--<shiro:hasPermission name="umbrella:batch:create"><a class="waves-effect waves-button" href="javascript:;" onclick="createAction()"><i class="zmdi zmdi-plus"></i> 新增</a></shiro:hasPermission>--%>
        <%--<shiro:hasPermission name="umbrella:batch:update"><a class="waves-effect waves-button" href="javascript:;" onclick="updateAction()"><i class="zmdi zmdi-edit"></i> 编辑</a></shiro:hasPermission>--%>
        <%--<shiro:hasPermission name="umbrella:batch:delete"><a class="waves-effect waves-button" href="javascript:;" onclick="deleteAction()"><i class="zmdi zmdi-close"></i> 删除</a></shiro:hasPermission>--%>
            <shiro:hasPermission name="wechatmp:gzuser:manage"><a class="waves-effect waves-button" href="javascript:;" onclick="manageAction()"><i class="glyphicon glyphicon-user"></i> 伞机管理员设置</a></shiro:hasPermission>
            <shiro:hasPermission name="wechatmp:gzuser:statusset"><a class="waves-effect waves-button" href="javascript:;" onclick="statussetAction()"><i class="glyphicon glyphicon-user"></i> 用户状态设置</a></shiro:hasPermission>
            <a class="waves-effect waves-button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"><i class="zmdi zmdi-search"></i> 高级搜索</a>
    </div>
    <table id="table"></table>
</div>
<jsp:include page="/resources/inc/footer.jsp" flush="true"/>

<script>
    var $table = $('#table');
    $(function() {
        // bootstrap table初始化
        $table.bootstrapTable({
            url: '${basePath}/manage/gzuser/list', //请求后台的URL（*）
            method: 'GET',                      //请求方式（*）
            height: getNoHeadHeight($('#queryHead').height),
            detailFormatter: 'detailFormatter',
            paginationLoop: false,
            silentSort: false,
            smartDisplay: false,
            escape: true,
            searchOnEnterKey: true,
            maintainSelected: true,
            toolbar: '#toolbar',               //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: true,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber: 1,                      //初始化加载第一页，默认第一页,并记录
            pageSize: 10,                     //每页的记录行数（*）
            pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
            search: false,                      //是否显示表格搜索
            strictSearch: true,
            showColumns: true,                  //是否显示所有的列（选择显示的列）
            showRefresh: true,                  //是否显示刷新按钮
            minimumCountColumns: 2,             //最少允许的列数
            clickToSelect: true,                //是否启用点击选中行
            showToggle: true,                   //是否显示详细视图和列表视图的切换按钮
            cardView: false,                    //是否显示详细视图
            detailView: false,                  //是否显示父子表
            idField: 'id',
            //得到查询的参数
            queryParams : function(params) {
                var temp = {
                    limit : params.limit, // 每页显示数量
                    offset : params.offset, // SQL语句起始索引
                    userId : $('#userId').val(),
                    userName : $('#userName').val(),
                    userTel : $('#userTel').val(),
                    beginTime : $('#beginTime').val(),
                    endTime : $('#endTime').val()
                };
                return temp;
            },
            columns: [
                {field: 'ck', checkbox: true},
                {field: 'id', title: '用户编号'},
                {field: 'nickname', title: '昵称'},
                {field: 'sex', title: '性别',formatter: function (value, row, index) {
                    return getDictText("MP_SEX_TYPE",value);
                }},
                {field: 'createTime', title: '注册时间',formatter:  'detailLongDateFormatter'},
                {field: 'mobile', title: '电话'},
                {field: 'province', title: '省份'},
                {field: 'city', title: '城市'},
                {field: 'country', title: '地区'},
                {field: 'userstatus', title: '状态',formatter: function (value, row, index) {
                    return getDictText("MP_USER_STATUS",value);
                }},

                {field: 'manage', title: '是否管理员',formatter: function (value, row, index) {
                    return getDictText("UPMS_YES_NO",value);
                }}
            ]
        });
    });
    //查询按钮事件
    $('#search_btn').click(function() {
        $('#table').bootstrapTable('refresh', {
            //得到查询的参数
            queryParams : function(params) {
                return splitFormSerializeValue('queryForm',params);
            },
            url : '${basePath}/manage/gzuser/list'
        });
    })
    //重置按钮事件
    $("#reset_btn").click(function(){
        $("#queryForm").resetForm();
    });

    $(function(){
        $('#beginTime,#endTime').datepicker({
//            format: 'yyyy-mm-dd'
        });
    });

    var manageDialog;
    function manageAction(){
        var rows = $table.bootstrapTable('getSelections');
        if(rows.length==0){
            infoDialog("请选择一个用户。");
            return;
        }
        manageDialog = openDialog('url:${basePath}/manage/gzuser/manage/'+rows[0].id,'管理员设置');
    }

    var statussetDialog;
    function statussetAction(){
        var rows = $table.bootstrapTable('getSelections');
        if(rows.length==0){
            infoDialog("请选择一个用户。");
            return;
        }
        statussetDialog = openDialog('url:${basePath}/manage/gzuser/statusset/'+rows[0].id,'用户状态设置');
    }
</script>
</body>
</html>